	html,
	body{
		height;100%;
		font-family: "微软雅黑";
	}
	ul,li{
	    list-style-type: none;	
	}
	
	.navbar-inverse {
	    background-color: #181818;
	    }
	.navbar{
		width:100%;
	    border-radius:0;
	    margin-bottom: 0;
	}
	.navbar ul{
		width:100%;
		height:50px;
		margin:0 auto;
		padding-left:0;
	}
	.navitem li{
		float:left;
		width:100px;
		margin:0 auto;
	}
	.logo{
		float:left;
		margin: 0 0 0 10px;
	}
	.navlas{
	    font-size: 14px!important;
	    padding-left: 8px;
	    color: #ccc!important;
	}
	.navitem a{
		display:block;
		width:100%;
		line-height:50px;
		text-align:center;
		color:#fff;
		font-size:20px;
		text-decoration:none;
	}
	a.nava:hover{
		color:#007aff!important;
	}
    .activeNav{
    	color:#007aff!important;
    }
	.seach{
	    width: 10%;
	    text-indent: 10px;
	    border: none;
	    margin-top: 15px;
	    background: #333;
	    border-radius: 15px;
	    color: #fff;
	}
	.seach:focus { 
		outline: none;
	}
	.navitem .active{
		color:#fff;
	}
	.mianContainer{
	    width: 100%;
	    position: absolute;
	    left: 0;
	    top: 52px;
		bottom:50px;
		overflow-y: scroll;
	}
	.endFooter{
		width:100%;
		height:50px;
		border-top:1px solid #ccc;
		color:#fff;
		position:fixed;
		left:0;
		bottom:0;
		z-index:2;
		background:rgba(0, 0, 0, 0.7);
	}
	.endFooter .singer{
		width:15%;
	}
	.endFooter .singer img{
		display:block;
		width:40px;
		height:40px;
		border:1px solid transparent;
		border-radius:50%;
		margin: 2% 0 0 30%;
	}
	.endFooter div{
		float:left;
	}
	.endFooter .singerInfo{
		width:30%;
		overflow: hidden;
		margin-left: 10px;
	}
	.endFooter .singsname{
		display:inline-block;
		line-height:12px;
		font-size:10px;
	}
	.endFooter .singername{
		display:inline-block;
		width:100%;
		text-align:center;
		font-size:10px;
	}
	.endFooter .controlsIcon{
		width:50%;
	}
	.endFooter .controlsIcon span{
	    display: inline-block;
	    width: 18%;
	    font-size: 28px;
	    margin: 1% 0 0 12%;
	}
	.mainbody{
		width:100%;
		height:666px;
		position:absolute;
		left:0;
		top:52px;
		z-index:1;
	}
	.banner img{
		display:block;
		width:100%;
		height:300px;
		margin:0 auto;
	}
	.main img{
	    display: inline-block;
	    width: 49%;
	    height: 300px;
	    margin: 0 0 0 1px;
	}
	.main1 img{
		display:block;
		width:100%;
		margin:0 auto;
	}
	.btn-group{
		font-size:30px;
		color:#000;
	}
	.loadmore{
		text-align:center;
	}
	.mainRight{
		width:80%;
		background:#0a97d6;
		position: fixed;
		right:-100%;
		top:0;
	}
	.mainRight .user{
		width:100%;
		margin-left: 15px;
		padding-top: 20px;
	    font-size: 18px;
	    color: #9abaf7;	
	}
	.mainRight .userPic{
		display:inline-block;
		width:50px;
		height:50px;
		border:1px solid transparent;
		border-radius:50%;
	}
	.mainRight .userNum{
	    display: inline-block;
	    width: 90px;
	    margin-left: 10px;
	}
	.mainRight .usermMsg{
	    display: inline-block;
	    width: 75px;
	    margin-left: 10px;
	}
	.mainRight .fa-envelope{
		margin-right:10px;
	}
	.mainRight .addUser{
		width:100%;
		height:80px;
	}
	.mainRight .addUser span{
		display: inline-block;
	    width: 45%;
	    height: 50px;
	    font-size: 18px;
	    color: #fff;
	    text-align: center;
	    padding:20px 0 0 15px;
	}
	.mainRight .addUser i{
		font-size:30px;
	}
	.mainRight .addUser a{
		display: inline-block;
		color:#9abaf7;
		text-decoration: underline;
		padding-left:10px;
	}
	.mainRight .userList{
	    width: 100%;
	    height: 270px;
	    text-align: center;
	    border-top: 1px solid #1d97f5;
	    border-bottom: 1px solid #1d97f5;
	    margin-bottom: 0;
	}
	.mainRight .userList li{
	    width: 33%;
	    float: left;
	    margin:10px 0;
	}
	.mainRight .userList i{
		display:block;
		font-size:40px;
		color:#fff;
	}
	.mainRight .userList span{
		display:inline-block;
		color:#9abaf7;
		margin-top:10px;
	}
	.mainRight .userOth{
		display: inline-block;
	    width: 100%;
	    line-height: 30px;
	    padding-left: 10%;
	}
	.mainRight .userOth a{
		color:#9abaf7;
	}
	.mainRight .userOth a:nth-child(2){
		padding-left:30px;
	}
	.mainRight .userSet{
		line-height:30px ;
		padding-left:10%;
	}
	.mainRight .userSet span{
		display: inline-block;
		width:50%;
	}
	.mainRight .userSet i{
		font-size: 24px;
	    color: #9abaf7;
	}
	.mainRight .userSet a{
		font-size:20px;
		color:#9abaf7;
		text-decoration: underline;
	}   
	.search{
		width:100%;
		background: #fff;
	    position: fixed;
	    right: -120%;
	    top: 0;
	    bottom: 50px;
	    z-index: 5;
	}
	.search .searchNav{
		width:100%;
		height:50px;
		background:#03a9f4;
		padding: 10px 0 0 5%;
	}
	.search .searchBox{
		display: inline-block;
		width:85%;
		line-height:30px;
		background:#fff;
	}
	.search .searchBox .fa-search{
		display:inline-block;
		width:10px;
		color:#C0C0C0;
		font-size:18px;
		margin: 0 10px 0 20%;
	}
	.search .searchBox input{
		display:inline-block;
		width:60%;
		border:none;
	}
	.search .searchBox input:focus{
		border:none;
	}
	.search .searchBox .fa-microphone{
		font-size:18px;
	}
	.search .searchNav .can{
		display: inline-block;
		width:40px;
		color:#C0C0C0;
	}
	.search .searchMost{
		width:100%;
		padding: 10px 15px;
	}
	.search .searchMost .fa-repeat{
		float: right;
	    padding-right: 15px;
	    color:#C0C0C0;
	}
	.search .searchMost .hotWord{
		width:100%;
		height:100px;
		padding-left: 20px;
	}
	.search .searchMost .hotWord li{
		float:left;
		width:100%;
		line-height: 36px;
	}
	.search .searchMost .hotWord a{
		display:inline-block;
		width:33%;
		text-decoration: underline;
		color:#C0C0C0;
	}
	.search .searchMost .hotWord_three a{
		width:45%;
	}
	.search .searchHis li{
		font-size:20px;
	}
	.search .searchHis .searchHistroy  a{
		width:80%;
		text-decoration: none;
	}
	.search .searchHis .fa-clock-o{
		display:inline-block;
		width:10%;
		color:#C0C0C0;	
	}
